<%-- 
    Document   : datelog
    Created on : 12/06/2011, 04:24:05 م
    Author     : Mostafa
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="html" uri="http://struts.apache.org/tags-html" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
         <link rel="stylesheet" media="all" type="text/css" href="css/jquery-ui-1.8.6.custom.css" />
         <script type="text/javascript" src="js/jquery-1.5.1.js"></script>

     
        <script type="text/javascript" src="js/jquery.ui.datepicker.js"></script>
        <script type="text/javascript" src="js/jquery.ui.widget.js"></script>
        <script type="text/javascript" src="js/jquery.ui.core.js"></script>

        <style>
            .ui-timepicker-div .ui-widget-header{ margin-bottom: 8px; }
            .ui-timepicker-div dl{ text-align: left; }
            .ui-timepicker-div dl dt{ height: 25px; }
            .ui-timepicker-div dl dd{ margin: -25px 10px 10px 65px; }
            .ui-timepicker-div td { font-size: 90%; }
        </style>
    </head>
    <script>
   $(function() {
		
              $( "#datepicker" ).datepicker({ dateFormat: "dd/mm/yy" ,
			showButtonPanel: true , 
                        onClose: function(dateText, inst) { change(); }    
                } );
               
                

     
  
	});
        
        
        
        var xmlhttp;
        var skip=0;    
        var c=-1;
        var first=0;
        var steps=new Array();
            function change(){
                var date = document.getElementById("datepicker").value;
                
                  if (window.XMLHttpRequest)
                {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
              //  alert(skip);
            xmlhttp.onreadystatechange=handlechange;
            xmlhttp.open("GET","datelog.do?date=" + date +"&skip="+skip,true);
            xmlhttp.send();
                
            }
         function handlechange()
            {
                
                if(xmlhttp.readyState==4){
                    var divresult=document.getElementById("logdiv");
                    var txt=xmlhttp.responseText;
                   divresult.innerHTML=txt;
                   
                   if(txt!="No Data Available Next ....")
                {first=0;  }
                
                
                   if(skip==-1)
                   {
                    
                   skip=0;
                }
              
                
                else if(first>0)
                    {c--;}
                  else{
                    skip+=txt.length;
                    steps[c]=txt.length;
                }
                if(txt=="No Data Available Next ....")
                {first++;  }
                else{first=0;}
                divresult.innerHTML+=" <br> <input type=\"button\" value=\"Previous\" onclick=\"previous()\"/>";
                  divresult.innerHTML+=" <input type=\"button\" value=\"Next\" onclick=\"next()\"/>";
                  
                  
                }
                
            }
            
            function firstStep()
            {
                
                c=0;
                change();
            }
            function next()
            {
               c++; 
                change();
            }
            
            function previous()
            {
                
               if(steps.length<1||c<0)
                   {skip=-1;
                   c=-1;
                   }
                   else{
                skip-=steps[c];
                skip-=steps[c-1];
                   }
                
                c--;
                change();
            }
	</script> 
    
    <body> 
 

Date: <input type="text" id="datepicker" /> 



<div id="logdiv"></div>

 
</body> 
</html>
